<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
    <%- include("./component/header.html"); %>
    <style>
        #container {
            display: grid;
            grid-template-columns: 1fr;
            gap: 30px;
            place-items: center;
            margin-top: 40px;
        }
        .mainNav {
            vertical-align: middle;
            margin: 0 8px;

            transition: 0.26s;
        }
        .mainNav:hover {
            color: #fff;
            background-color: black;
            padding: 5px 8px;
            border-radius: 4px;
            transform: scale(1.2);
        }
    </style>
</head>

<body>
    <%- include("./component/navbar.html"); %>
    <main class="main">
        <h1>
            <%= title %>
        </h1>
        <div id="container">
            <% Object.keys(dashboardPage).forEach(item => { %>
                <% if (item.indexOf("index") == -1) { /* 跳过 仪表盘 */ %>
                    <a class="mainNav" href="./<%= item %>"><%= dashboardPage[item].title %></a>
                <% } %>
            <% }); %>
        </div>
    </main>
    <%- include("./component/footer.html"); %>
</body>

</html>